<template>
    <div class="a" v-show="show">
        <button class="btn btn-danger" @click="backTop">
            <i class="fa fa-angle-up"></i>
        </button>
    </div>
</template>

<style scoped="">
    .a{position: fixed; bottom: 50px; right: 50px}
</style>

<script>
    /* eslint-disable no-undef */
    export default {
    	name: 'BackTopButton',
        data () {
            return {
                show: false
            };
        },
        methods: {
            scroll () {
                if ($(window).scrollTop() > 500) {
                    this.show = true;
                } else {
                    this.show = false;
                }
            },
            backTop () {
                let t = $(window).scrollTop() / 1000 * 100;
                $('*').animate({scrollTop: 0}, t);
            }
        },
        mounted () {
            window.addEventListener('scroll', this.scroll);
        }
    };
</script>
